// page/productlist/productlist.js
Page({

    /**
     * 页面的初始数据
     */
    data: {
        baseURL:wx.baseURL,
        total:0,
        rows:[],
        brandSelected:{},//已选品牌，通过参数来控制已经选择的
        brands:[],
        brandvisible:false,
        query:{
            sorted:0,
            brandIds:'',
            pageNum:1,
            pageSize:10,
             key :''
        },
       
    
    },
    //清空选择品牌
    clearbrand(){
        this.setData({
            brandSelected:{}
        })
    },
    //按品牌进行搜索
    confirmbrand(){
        let brandIds = []
        for(let key in this.data.brandSelected){//取出选择的品牌id
            if( key && this.data.brandSelected[key]) brandIds.push(key)
        }
        this.data.query.brandIds=brandIds.join(',')
          console.log(this.data.query.brandIds,brandIds);
        this.refresh(()=>{
            this.setData({
                brandvisible:false
            })
        })
    },
//切换品牌选择状态
    changeBrand(e){
        let  brandSelected=this.data. brandSelected
        let id=e.currentTarget.dataset.id
        brandSelected[id]=!brandSelected[id]//取反，切换选择状态
        this.setData({
        brandSelected
        })
    },

    //切换品牌弹框
    changebrandvisible(){
        let brandSelected={}
        if(this.data.brandvisible &&this.data.query.brandIds){//打开品牌弹框
            //接上一次选择结果初始已选中品牌
        let  brandIds=this.data.query.brandIds.split(',')
        for(let i=0;i<brandIds.length;i++){
        brandSelected[brandIds[i]]=true

        }
        console.log(brandIds,brandSelected);
        }
        this.setData({
            brandvisible:!this.data. brandvisible,
            brandSelected
        })
        
    }
    ,

//setdata用于更新ui界面的触发函数，只有调用它才能触发ui界面的更新
    inputkey(e){
          this.data.query.key =e.detail.value
    },

    refresh(next){
///点击之后清空，重新加载意义同下拉加载一样，将下拉加载的东西放在这里之后，在真正的下拉加载中直接调用refresh这个方法
this.data.query.pageNum = 1
this.data.rows =[]
this.data.total=0
this.getlist(next)
    // 在这里不用使用这个暂停wx.stopPullDownRefresh()，直接在refresh后面的括号中填写next使用传递，致使在下方真正的下拉加载函数中条用getlist方法的传DI
},

detail:function(e){
wx.navigateTo({
  url: '../productdetail/productdetail?productId='+ e.currentTarget.dataset.id,
})
},
//修改排序
changeSorted(e){
    let sorted =e.currentTarget.dataset.sorted
    this.setData({
        'query.sorted':sorted
    })
    //刷新
    this.refresh()
},
 return:function(e){
wx.navigateBack({
data:1
})
   },


    getlist(next){
    
        wx.get('/products',this.data.query).then(res=>{
            res.rows.forEach((item,index)=>{
              item.img= wx.baseURL+ item.productImgs.split(',')[0]
            })
            this.setData({
                total:res.total,
                rows:this.data.rows.concat(res.rows)
            
            })
            if (typeof next=='function') next()
        })
    },

//获取品牌列表
 getBrands(){
wx.get('/brands').then(res =>{
    this.setData({
        brands:res
    })
})
 },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
        console.log(options)
        this.setData({
            'query.key' :options.key ||'',
            'query.brandIds':options.brandIds ||''
        })
        this.getBrands()
    this.getlist()
    },

    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {

    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {

    },

    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {

    },

    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {
      this.refresh(()=>{
          wx.stopPullDownRefresh()
      })
    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {
    this.data.query.pageNum ++
    if(this.data.rows.length < this.data.total) this.getlist()
    
    },

    /**
     * 用户点击右上角分享 
     */
    onShareAppMessage: function () {

    }
})